<template>
  <my-tabbar>
    <my-tarbar-item path="/home" activeColor="red">
      <i slot="item-icon" class="iconfont icon-shouye"></i>
      <i slot="item-icon-active" class="iconfont icon-shouye"></i>
      <div slot="item-text">首页</div>
    </my-tarbar-item>
    <my-tarbar-item path="/category" activeColor="red">
      <i slot="item-icon" class="iconfont icon-leimupinleifenleileibie"></i>
      <i
        slot="item-icon-active"
        class="iconfont icon-leimupinleifenleileibie"
      ></i>
      <div slot="item-text">分类</div>
    </my-tarbar-item>
    <my-tarbar-item path="/cart" activeColor="red">
      <i slot="item-icon" class="iconfont icon-gouwuchekong"></i>
      <i slot="item-icon-active" class="iconfont icon-gouwuchekong"></i>
      <div slot="item-text">购物车</div>
    </my-tarbar-item>
    <my-tarbar-item path="/profile" activeColor="red">
      <i slot="item-icon" class="iconfont icon-wode2"></i>
      <i slot="item-icon-active" class="iconfont icon-wode2"></i>
      <div slot="item-text">我的</div>
    </my-tarbar-item>
  </my-tabbar>
</template>

<script>
import TabBar from "./tabbar/TabBar.vue";
import TabBarItem from "./tabbar/TabBarItem.vue";
export default {
  components: {
    "my-tabbar": TabBar,
    "my-tarbar-item": TabBarItem,
  },
};
</script>

<style>
</style>